if (!window.console) console = {log: function() {}};

function closeAlbum() {

    $('#overlay').fadeOut();
    $('#album').fadeOut();
    
    $('#album').html('');
    
};
        
function openAlbum(link) {

    $('#overlay').fadeIn();
    $('#album').fadeIn();
    
    var albumsource = '<iframe scrolling="no" src="__LINK__&noredirect=1#slideshow" width="100%" height="100%">Failed to display album</iframe>';
    albumsource = albumsource + '<button onmousedown="closeAlbum()" style="border-style: solid;">Close Album</button>';
    
    $('#album').html('');
    $('#album').html(albumsource.replace("__LINK__",link));
    
};

function createAlbum(rss) {

  console.log("INFO: Creating album thumnail from rss feed " + rss);

  // Use the JSON object for the feed
  rss=rss.replace("alt=rss","alt=json");

  // Global slide show settings
  window.currentPhoto = 0;
  window.totalPhotos = 0;
  window.albumPhotos = {};

  ptext = '<br / ><b>Album</b><br / ><br / ><div id="post-album-thumbnail-container">';
  ptext += '  <div id="post-album-thumbnail"></div>';
  ptext += '</div>';
  ptext += '<div id="post-album-thumbnail-padding"></div>';
  ptext += '<div id="post-album-overlay"></div>';
  ptext += '<div id="post-album">';
  ptext += '  <div id="post-album-nav-left" class="post-album-nav-button"></div>';
  ptext += '  <div id="post-album-nav-right" class="post-album-nav-button"></div>';
  ptext += '  <div id="post-album-nav-top">';
  ptext += '     <div id="post-album-nav-close" class="post-album-nav-button"></div>';                 
  ptext += '  </div>';
  ptext += '  <div id="post-album-photo-frame"></div>';
  ptext += '  <div id="post-album-nav-play-pause"></div>';
  ptext += '  <div id="post-album-nav-bottom">';
  ptext += '     <div id="post-album-nav-slider-viewport">';
  ptext += '        <div id="post-album-nav-slider-left">';
  ptext += '           <img src="http://3.bp.blogspot.com/-Ngv6UDKvj-g/UfB9HfQYCbI/AAAAAAAA7EA/HKMpGO4L4CA/s1600/left_arrow.png" / >';  
  ptext += '        </div>';
  ptext += '        <div id="post-album-nav-slider"></div>';
  ptext += '        <div id="post-album-nav-slider-right">';
  ptext += '           <img src="http://4.bp.blogspot.com/-8-Gthp-xNU0/UfB9H9Z4GQI/AAAAAAAA7D8/4t9ydfCcemA/s1600/right_arrow.png" / >';  
  ptext += '        </div>';
  ptext += '     </div>';
  ptext += '     <div id="post-album-nav-scroll-bar-container" class="post-album-nav-button">';
  ptext += '        <div id="post-album-nav-scroll-bar"></div>';
  ptext += '     </div>';
  ptext += '  </div>';
  ptext += '</div>';

  $('#post-album-container').append(ptext);
  $('#post-album-thumbnail').css('white-space','nowrap');

  $.getJSON(rss + '&max-results=1000&imgmax=1280&thumbsize=128&callback=?',updateAlbum);

};

function updateAlbum(PhotoFeed) {

  var feed = PhotoFeed.feed;

  window.totalPhotos = feed.entry.length ;

  console.log("INFO: There are " + window.totalPhotos + " photos in the album");

  var tnhtml = '<img id="post-album-thumbnail-play-image" src="http://2.bp.blogspot.com/-ArgP_4zsHSg/UWYWDanu5pI/AAAAAAAA4fw/XWpco6TGDgg/s320/gtk_media_play_ltr.png" / >';
 
  var tnWidth = $('#post-album-thumbnail').width();

  var tnImageWidth = 0;
  
  for(var count = 1; count <= window.totalPhotos ; count++ ) {

     var photo = feed.entry[count-1];

     var pid = "APID-" + count;

     window.albumPhotos[count] = {};
     window.albumPhotos[count]['src'] = photo.content.src;
     window.albumPhotos[count]['thumbnail'] = photo.media$group.media$thumbnail[0].url;

     if ( tnImageWidth < tnWidth ) {  
       tnhtml +='<img src="' + window.albumPhotos[count]['thumbnail'] + '" / >';
       tnImageWidth += photo.media$group.media$thumbnail[0].width;
     }

     $('#post-album-nav-slider').append('<img id="' + pid + '" src="' + window.albumPhotos[count]['thumbnail'] + '" / >');

     $('#' + pid).click(function(){
        slideShow('pause');
        changePhoto( parseInt($(this).attr('id').replace('APID-',''),10) - window.currentPhoto);
     });

  }

  $('#post-album-thumbnail').append(tnhtml);

  $('#post-album-nav-slider-left').on('mousedown',function(){ changeSlider('left') });
  $('#post-album-nav-slider-right').on('mousedown',function(){ changeSlider('right') });

  $('#post-album-nav-left').on('mousedown',function(){ slideShow('previous') });
  $('#post-album-nav-right').on('mousedown',function(){ slideShow('next') });

  $('#post-album-photo-frame').on('mousedown',function(){slideShow('toggle')});

  $('#post-album-photo-frame').css('background-image','url(' + window.albumPhotos[1]['src'] +')').fadeIn();

  $('#post-album-thumbnail').on('mousedown',function() {
    $('#post-album-overlay').show();
    $('#post-album').show();
    $('body').css('overflow','hidden');
    slideShow('play');
  });

  $('#post-album-nav-close').on('mousedown',function() {
    $('#post-album-overlay').hide();
    $('#post-album').hide();
    $('body').css('overflow','auto');
    slideShow('stop');
  });
  
};

function changeSlider(mode) {

  var sid = '#post-album-nav-slider';

  var slx = $(sid).offset().left;
  var delta = $('#post-album-nav-slider-viewport').width();

  var plx = $('#APID-1').offset().left - 36;
  var pux = $('#APID-' + window.totalPhotos).offset().left + $('#APID-' + window.totalPhotos).width() + 54;

  var vlx = $('#post-album-nav-slider-viewport').offset().left;
  var vux = $('#post-album-nav-slider-viewport').offset().left + $('#post-album-nav-slider-viewport').width();
  
  slideShow('pause');

  switch(mode) {
     case 'left':
        if ( plx < vlx ) {
          if (  delta > (vlx - plx) ) delta = vlx - plx;
          $(sid).animate({'left':  (slx + delta) + 'px' },300);
        }    
        break;    
     case 'right': 
        if ( pux > vux ) {
          if (  delta > (pux - vux) ) delta = pux - vux;
          $(sid).animate({'left':  (slx - delta) + 'px' },300);
        }    
        break;    
     default:
        console.log("INFO: Invalid mode specified");
        break;
  }

}

function changePhoto(delta) {

   var nextPhoto = window.currentPhoto + delta;

   if ( nextPhoto > window.totalPhotos ) {
       nextPhoto = 1;        
   } else if ( nextPhoto < 1 ) {
       nextPhoto = window.totalPhotos;
   }

   // Change the slider position
   var oldpid = '#APID-' + window.currentPhoto;
   var newpid = '#APID-' + nextPhoto;

   var plx = $(newpid).offset().left - 36;
   var pux = $(newpid).offset().left + $(newpid).width() + 54;

   var vlx = $('#post-album-nav-slider-viewport').offset().left;
   var vux = $('#post-album-nav-slider-viewport').offset().left + $('#post-album-nav-slider-viewport').width();

   var slx = $('#post-album-nav-slider').offset().left;

   // Check if slide photo is outside the viewport and move the slider left or right
   if ( pux > vux ) {
       $('#post-album-nav-slider').css('left',slx - (pux-vux));
   } else if ( plx < vlx ) {
       $('#post-album-nav-slider').css('left',slx + (vlx-plx));
   }

   $(oldpid).css('border','3px solid transparent');
   $(newpid).css('border','3px solid #DDDDDD');
   
   $('#post-album-photo-frame').hide().css('background-image','url(' + window.albumPhotos[nextPhoto]['src'] +')').show();

   window.currentPhoto = nextPhoto;

   // Change the status text
   // $('#post-album-nav-progress-text').html(window.currentPhoto + ' / ' + window.totalPhotos);

}

function slideShow(mode) {

   var pauseImage = 'http://1.bp.blogspot.com/-G5PM23EGMSY/UgbxfV-i76I/AAAAAAAA7Sk/zlDsTwi7B0w/s1600/pause.png';
   var playImage = 'http://2.bp.blogspot.com/-TbYhbp6EzyA/UgbxfeCm5OI/AAAAAAAA7So/vlCp0Iz2cd0/s1600/play.png';

   switch(mode) {
      case "start" :
          changePhoto(1);
          slideShow('play');
          break;
      case "play" :
          console.log('INFO: Playing slide show');
          $('#post-album-nav-play-pause').hide().css('background-image','url(' + playImage + ')').fadeIn().fadeOut(2000);
          window.slideShowTimer = setInterval(function(){changePhoto(1)},4000);
          window.slideShowState = "playing"
          break;
      case "next" :
          slideShow("pause");
          changePhoto(1);
          break;
      case "previous" :
          slideShow("pause");
          changePhoto(-1);
          break;
      case "pause" :
          if ( window.slideShowState == 'playing' ) {
            $('#post-album-nav-play-pause').hide().css('background-image','url(' + pauseImage + ')').fadeIn().fadeOut(2000);
            clearInterval(window.slideShowTimer);
            window.slideShowState = "paused"
          }
          break;
      case "toggle" :
          if( window.slideShowState == "playing" ) {
            slideShow('pause');
          } else {
            slideShow('play');
          }
          break;
      case "stop" :
          clearInterval(window.slideShowTimer);
          break;
   }

}



